<template>
    <div class="add">
        <div class="head">
            <van-nav-bar
            title="添加"
            left-text="返回"
            left-arrow
            @click-left="onClickLeft"
          />
        </div>
        <div class="search">
            <van-search
          v-model="inputText"
          shape="round"
          background="linear-gradient(45deg, #0081ff, #1cbbb4)"
          placeholder="请输入搜索关键词"
        />
</div>
  <div class="bottom">
    <van-button type="primary" size="large" color="#0096FF" @click="add" :round="true">新增</van-button>
  </div>
    </div>
  </template>
  
  <script setup>
 import {ref} from 'vue'
//从vuex中导入useStore方法
import {useTasklistStore} from '../stores/tasklist'
import { useRouter } from 'vue-router';
var $router=useRouter()
var inputText = ref('')

//调用useStore方法 获取store对象
var store = useTasklistStore()
//新增任务
var add = ()=>{
  store.addtask(inputText.value);//调用vuex中的同步方法addTask,新增任务
  inputText.value = '';
}
    var onClickLeft = () => {
        history.back();
    return {
      onClickLeft,
    }
}
var add =()=>{

    store.addtask(inputText.value);//调用vuex中的同步方法addTask,新增任务
  inputText.value = '';
}
  </script>
  
  <style scoped>
 .bottom{
    margin: 5px 0;
    width: 100%;
    margin: 20px auto ;
 }
  </style>